// scss 参考指南
// https://blog.csdn.net/wanghuan1020/article/details/111322030  
$primary-color: #1269b5;
$primary-border: 1px solid $primary-color;


/* 定义 */
@mixin alertDemo {
    color: #8a6b3a;
    background-color: #fcf8e3;
    a {
      color: #664f2b;
    }
  }
  // 引用
  .alert-waring {
    @include alertDemo;
  }

/* 继承 */
  .alert {
    padding: 15px;
  }
  
  .alert a {
    font-weight: bold;
  }
  
  .alert-info {
    @extend .alert;
    background-color: #d9edf7;
  }


/* 携带参数 */
  @mixin alert($text-color, $background) {
    color: $text-color;
    background-color: $background;
    a {
      color: darken($color: $text-color, $amount: 10%); // $text-color颜色加深10%
    }
  }
  // 引用
  .alert-waring {
    @include alert(#8a6b3a, #fcf8e3);
  }
  // 指定形参
  .alert-info {
    @include alert($background: #d9edf7, $text-color: #31708f);
  }
